<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://xmlns.jcp.org/jsf/passthrough">

    <h:body>
        <ui:composition template="./Templates/TemplateInterno.xhtml">
            <ui:define name="topoInterno"></ui:define>
            <ui:define name="content">
                <!--############################MODAL ADD CONTA ###############################-->
                <h:panelGroup layout="block" class="container">
                    <h:panelGroup layout="block" class="modal fade" id="myModal" p:role="dialog">
                        <h:panelGroup layout="block" class="modal-dialog modal-sm">
                            <h:panelGroup layout="block" class="modal-content">
                                <h:panelGroup layout="block" class="modal-header">
                                    <h:outputLabel class="modal-title" id="myModalLabel" value="Adicionar Conta"/>
                                </h:panelGroup>
                                <h:form role="form" id="formulario"> 
                                    <h:panelGroup layout="block" class="modal-body">                               
                                        <h:panelGroup layout="block" class="form-group">
                                            <h:outputLabel value="Nome"/>
                                            <h:panelGroup layout="block" class="input-group">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-piggy-bank"></span></span>
                                                <h:inputText required="true" value="#{contaMB.conta.nome}" maxlength="50" class="form-control" />
                                            </h:panelGroup>
                                        </h:panelGroup>   
                                        <h:panelGroup layout="block" class="form-group">
                                            <h:outputLabel value="Saldo Inicial"/>
                                            <h:panelGroup layout="block" class="input-group">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-usd"></span></span>
                                                <h:inputText required="true" value="#{contaMB.conta.saldo}" class="form-control dinheiro "/>
                                            </h:panelGroup>
                                        </h:panelGroup> 
                                        <h:outputLabel value="Tipo de Conta"/><br></br>
                                        <h:panelGroup layout="block" class="input-group">
                                            <span class="input-group-addon"><span class="glyphicon glyphicon-th-list"></span></span>
                                            <h:selectOneMenu value="#{contaMB.idTipo}" style="width:200px;height:30px;border-radius:3px;">
                                                <f:selectItems value="#{tipoContaMB.lista}"/>   							
                                            </h:selectOneMenu>
                                        </h:panelGroup>  
                                    </h:panelGroup>
                                    <h:panelGroup layout="block" class="modal-footer">
                                        <h:commandButton value="Cancelar" class="btn btn-danger" p:data-dismiss="modal"/>
                                        <h:commandButton value="Salvar" class="btn btn-success " type="submit">
                                            <f:ajax event="click" 
                                                    listener="#{contaMB.addContaM}"
                                                    execute="@all"/>
                                        </h:commandButton>
                                    </h:panelGroup>
                                </h:form>
                            </h:panelGroup>
                        </h:panelGroup>
                    </h:panelGroup>
                </h:panelGroup>
                <!--#####################################FIM DO MODAL ADD CONTA ######################################-->
                <h:panelGroup layout="block" class="container">
                  <h:panelGroup layout="block" class="modal fade" id="myModalC" p:role="dialog">
                    <h:panelGroup layout="block" class="modal-dialog modal-sm">
                        <h:panelGroup layout="block" class="modal-content">
                            <h:panelGroup layout="block" class="modal-header">
                              <h:outputLabel class="modal-title" id="myModalLabelC" value="Adicionar Nova Categoria" styleClass="font-size:large"/>
                            </h:panelGroup>
                                <h:form role="form">
                                    <h:panelGroup layout="block" class="modal-body"> 
                                <h:panelGroup layout="block" class="form-group">
                                    <h:outputLabel value="Nome"/>
                                    <h:panelGroup layout="block" class="input-group">
                                        <span class="input-group-addon"><span class="glyphicon glyphicon-list-alt"></span></span>
                                        <h:inputText required="true" value="#{categoriaMB.categoria.nome}" maxlength="50" class="form-control" requiredMessage="Informe o usuario"/>
                                    </h:panelGroup>
                                </h:panelGroup>
                                     <h:outputLabel value="Tipo de Categoria"/>
                                    <h:panelGroup layout="block" class="input-group">
                                        <span class="input-group-addon"><span class="glyphicon glyphicon-th-list"></span></span>
                                        <h:selectOneMenu value="#{categoriaMB.idTipo}" style="width:200px;height:30px;border-radius:3px;">
                                            <f:selectItems value="#{tipoMovimentacaoMB.lista}"/>   							
                                        </h:selectOneMenu>
                                    </h:panelGroup>    
                            </h:panelGroup>
                            
                            <h:panelGroup layout="block" class="modal-footer">
                                <h:commandButton value="Cancelar" class="btn btn-danger" p:data-dismiss="modal"/>
                                <h:commandButton value="Salvar" class="btn btn-success " type="submit">
                                    <f:ajax event="click" listener="#{categoriaMB.addCategoriaM}" execute="@all"/>
                                </h:commandButton> 
                            </h:panelGroup>
                        </h:form>  
                        </h:panelGroup>
                    </h:panelGroup>
                </h:panelGroup>
            </h:panelGroup>
                <!--#####################################FIM DO MODAL ADD CATEGORIA ######################################-->
                <br/>
                <br/>
                <br/>
                <h:panelGroup layout="block" class="container">
                    <h:panelGroup layout="block" class="row">
                        <h:panelGroup layout="block" class="col-md-2"></h:panelGroup>
                        <h:panelGroup layout="block" class="col-md-8">
                            <h:panelGroup layout="block" class="panel panel-default"> 
                                <h:panelGroup layout="block" class="panel-body">
                                    <h:panelGroup layout="block" class="page-header">
                                        <h3>Adicionar Movimentações</h3>
                                    </h:panelGroup>    
                                    <h:form role="form"> 
                                            <h:panelGroup layout="block" class="form-group">
                                                <h:panelGroup layout="block" class="input-group">
                                                    <span class="input-group-addon"><span class="glyphicon glyphicon-text-background"></span></span>
                                                    <h:inputText required="true" value="#{movimentacaoMB.movimentacao.descricao}" maxlength="50" class="form-control"
                                                                 p:placeholder="Descrição" requiredMessage="Preencha todos os Campos"/>
                                                </h:panelGroup>
                                            </h:panelGroup>
                                            
                                         <h:panelGrid columns="4">
                                                <h:panelGroup layout="block" class="form-group">
                                                    <h:panelGroup layout="block" class="input-group">
                                                        <span class="input-group-addon"><span class="glyphicon glyphicon-usd"></span></span>
                                                        <h:inputText required="true" value="#{movimentacaoMB.movimentacao.valor}" class="form-control dinheiro" p:placeholder="valor"
                                                                     requiredMessage="Preencha todos os Campos"/>
                                                    </h:panelGroup>
                                                </h:panelGroup>&nbsp;&nbsp;&nbsp;
                                                <h:panelGroup layout="block" class="form-group">
                                                    <h:panelGroup layout="block" class="input-group">
                                                        <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
                                                        <h:inputText required="true" value="#{movimentacaoMB.dataMovimentacao}" class="form-control inteiro" p:placeholder="Data"
                                                                     requiredMessage="Preencha todos os Campos"/>
                                                    </h:panelGroup>
                                                </h:panelGroup>
                                            </h:panelGrid>                                      
                                            <h:outputLabel value="Conta"/>
                                            <h:panelGroup layout="block" class="input-group">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-th-list"></span></span>
                                                <h:selectOneMenu value="#{movimentacaoMB.idConta}" style="width:200px;height:30px;border-radius:3px;">
                                                    <f:selectItems value="#{contaMB.listaContaCombo}"/>
                                                </h:selectOneMenu>&nbsp;&nbsp;
                                                <h:commandLink>
                                                    <f:ajax event="click" render="myModal" />
                                                        <span class="glyphicon glyphicon-plus"></span>
                                                        <f:passThroughAttribute name="data-toggle" value="modal" />
                                                        <f:passThroughAttribute name="data-target" value="#myModal"/>
                                                </h:commandLink> 
                                            </h:panelGroup> 
                                            <br/>
                                            <h:outputLabel value="Tipo de Movimentação"/>
                                            <h:panelGroup layout="block" class="input-group">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-th-list"></span></span>
                                                <h:selectOneMenu value="#{movimentacaoMB.idTipoMovimentacao}" style="width:200px;height:30px;border-radius:3px;">
                                                    <f:selectItems value="#{tipoMovimentacaoMB.lista}"/>   							
                                                </h:selectOneMenu>
                                            </h:panelGroup>
                                             <br/>
                                            <h:outputLabel value="Categoria"/>
                                            <h:panelGroup layout="block" class="input-group">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-th-list"></span></span>
                                                <h:selectOneMenu value="#{movimentacaoMB.idCategoria}" style="width:200px;height:30px;border-radius:3px;">
                                                    <f:selectItems value="#{categoriaMB.listaCategoria}"/>   							
                                                </h:selectOneMenu>&nbsp;&nbsp;
                                                 <h:commandLink>
                                                    <f:ajax event="click" render="myModalC" />
                                                        <span class="glyphicon glyphicon-plus"></span>
                                                        <f:passThroughAttribute name="data-toggle" value="modal" />
                                                        <f:passThroughAttribute name="data-target" value="#myModalC"/>
                                                </h:commandLink> 
                                            </h:panelGroup>  
                                            <br></br>
                                            <br></br>
                                            <h:commandButton value="Salvar" class="btn btn-success " type="submit">
                                                <f:ajax event="click" listener="#{movimentacaoMB.adicionarMovimentacao}" execute="@all"/>
                                            </h:commandButton>
                                    </h:form>
                                </h:panelGroup>        
                             </h:panelGroup>    
                        </h:panelGroup>    
                    </h:panelGroup>    
                </h:panelGroup>      
            </ui:define>
            <ui:define name="rodape"></ui:define>
        </ui:composition>
    </h:body>
</html>